<template>
  <div>
    <div>分类</div>
    <p>store中的count:{{ count }}</p>
    <p>store 中的计算属性:{{ doubleCount }}</p>
    <p>
      <button @click="addcount(10)">同步+10</button>
      <button @click="jiancount">同步-1</button>
      <button @click="addCountAsync(10)">异步+10</button>
      <button @click="jianCountAsync">异步-1</button>
    </p>
    <hr />
    <!-- 子模块shop中的数据 -->
    <ul>
      <li v-for="item in schoollist" :key="item.id">
        {{ item.school_name }}
      </li>
    </ul>
  </div>
</template>

<script>
import { mapState, mapMutations, mapActions, mapGetters } from "vuex";
export default {
  data() {
    return {};
  },
  computed: {
    ...mapState(["count"]),
    ...mapGetters(["doubleCount"]),

    ...mapState("shopModule", ["schoollist"]),
  },
  methods: {
    ...mapMutations(["addcount", "jiancount"]),
    ...mapActions(["addCountAsync", "jianCountAsync"]),
    ...mapActions("shopModule", ["initSchoolListAsync"]),
  },
  mounted() {
    console.log("this-category", this);
    this.initSchoolListAsync();
  },
};
</script>
<style scoped>
</style>